<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
	<title>湖南省自来水公司营销管理信息系统</title>

	<link rel="stylesheet" href="../css/reset.css" type="text/css" media="screen" title="no title"/>
	<link rel="stylesheet" href="../css/text.css" type="text/css" media="screen" title="no title"/>
	<link rel="stylesheet" href="../css/form.css" type="text/css" media="screen" title="no title"/>
	<link rel="stylesheet" href="../css/buttons.css" type="text/css" media="screen" title="no title"/>
	<link rel="stylesheet" href="../css/grid.css" type="text/css" media="screen" title="no title"/>
	<link rel="stylesheet" href="../css/layout.css" type="text/css" media="screen" title="no title"/>

	<link rel="stylesheet" href="../css/ui-darkness/jquery-ui-1.8.12.custom.css" type="text/css" media="screen"
		  title="no title"/>
	<link rel="stylesheet" href="../css/plugin/jquery.visualize.css" type="text/css" media="screen" title="no title"/>
	<link rel="stylesheet" href="../css/plugin/facebox.css" type="text/css" media="screen" title="no title"/>
	<link rel="stylesheet" href="../css/plugin/uniform.default.css" type="text/css" media="screen" title="no title"/>
	<link rel="stylesheet" href="../css/plugin/dataTables.css" type="text/css" media="screen" title="no title"/>

	<link rel="stylesheet" href="../css/custom.css" type="text/css" media="screen" title="no title">
	<!--layui-->
	<script src="../layui/layui.js" charset="utf-8"></script>
	<link rel="stylesheet" href="/../layui1.css">
	<style type="text/css">
		.searchDiv input.chk {
			width: auto;
			vertical-align: middle;
			padding: 0px;
			margin: 2px;
		}
	</style>
</head>

<body>

<div id="wrapper">
	<div id="bool"><script>window.onload=function (){  $("#bool").load("../ming.html");}</script></div>
	<!--<div id="header">

		<div class="content_pad">
			<h1><a href="../workspace.html">湖南省自来水公司营销管理信息系统</a></h1>

			<ul id="nav">

				<li class="nav_dropdown nav_icon">
					<a href="javascript:;"><span class="ui-icon ui-icon-wrench"></span>业扩工程</a>

					<div class="nav_menu">
						<ul>
							<li><a href="../page/be__request.html">01 用户申请</a></li>
							<li><a href="../page/be__audit.html">02 初步审核</a></li>
							<li><a href="../page/be__pay.html">03 交施工费</a></li>
							<li><a href="../page/be__billclear.html">04 水费清算</a></li>
							<li><a href="../page/be__contract.html">05 供水协议</a></li>
							<li><a href="../page/be__working.html">06 施工竣工</a></li>
							<li><a href="../page/be__open.html">07 通水停水</a></li>
							<li><a href="../page/be__save.html">08 档案存档</a></li>
							<li><a href="../page/be_order.html">工单管理</a></li>
							<li><a href="../page/be_abort.html">终止工单</a></li>
							<li><a href="../page/be_reportProgress.html">业扩工程进度</a></li>
							<li><a href="../page/be_reportMoney.html">业扩收费报表</a></li>
						</ul>

					</div>
				</li>

				<li class="nav_dropdown nav_icon">
					<a href="javascript:;"><span class="ui-icon ui-icon-person"></span>用户管理</a>

					<div class="nav_menu">
						<ul>
							<li><a href="../page/user_search.html">用户查询</a></li>
							<li><a href="../page/user_add.html">快捷新户</a></li>
							<li><a href="../page/user_changeName.html">快捷过户</a></li>
							<li><a href="../page/user_changeBank.html">快捷代扣</a></li>
							<li><a href="../page/user_changeMeter.html">快捷换表</a></li>
							<li><a href="../page/user_changeFormula.html">快捷重签</a></li>
							<li><a href="../page/user_delete.html">快捷销户</a></li>
							<li><a href="../page/user_reportShortcut.html">快捷操作记录</a></li>
							<li><a href="../page/user_docNum.html">档案号管理</a></li>
							<li><a href="../page/user_sendMsg.html">短信群发</a></li>
						</ul>

					</div>
				</li>

				<li class="nav_dropdown nav_icon">
					<a href="javascript:;"><span class="ui-icon ui-icon-pencil"></span>抄表管理</a>

					<div class="nav_menu">
						<ul>
							<li><a href="../page/rd_volume.html">表册管理</a></li>
							<li><a href="../page/rd_init.html">抄表初始化</a></li>
							<li><a href="../page/rd_task.html">任务分配</a></li>
							<li><a href="../page/rd_enter.html">抄表录入</a></li>
							<li><a href="../page/rd_audit.html">抄表审核</a></li>
							<li><a href="../page/rd_reportReading.html">抄表情况查询</a></li>
							<li><a href="../page/rd_reportVolumeReading.html">抄表统计报表</a></li>
							<li><a href="../page/rd_reportZero.html">零吨位用户查询</a></li>
							<li><a href="../page/rd_reportMaxValue.html">最大码值修正记录</a></li>
							<li><a href="../page/rd_reportCPreAmount.html">底码修正记录</a></li>
							<li><a href="../page/rd_reportMeterCheck.html">水表周检报表</a></li>
						</ul>

					</div>
				</li>

				<li class="nav_dropdown nav_icon">
					<a href="javascript:;"><span class="ui-icon ui-icon-star"></span>收费管理</a>

					<div class="nav_menu">
						<ul>
							<li><a href="../page/pay_window.html">窗口收费</a></li>
							<li><a href="../page/pay_batch.html">批量收费</a></li>
							<li><a href="../page/pay_invoiceReprint.html">发票补开/作废</a></li>
							<li><a href="../page/pay_reportDebts.html">欠费报表</a></li>
							<li><a href="../page/pay_reportPay.html">收费情况报表</a></li>
							<li><a href="../page/pay_reportMonthRecycle.html">月资金回收情况报表</a></li>
							<li><a href="../page/pay_reportBalance.html">用户预收情况报表</a></li>
							<li><a href="../page/pay_reportWaterType.html">各类用水统计总表</a></li>
						</ul>

					</div>
				</li>

				<li class="nav_dropdown nav_icon">
					<a href="javascript:;"><span class="ui-icon ui-icon-script"></span>发票管理</a>

					<div class="nav_menu">
						<ul>
							<li><a href="../page/inv_invoiceManage.html">发票总表</a></li>
							<li><a href="../page/inv_invoiceIn.html">发票入库</a></li>
							<li><a href="../page/inv_invoiceOut.html">发票出库</a></li>
							<li><a href="../page/inv_invoiceArchive.html">发票交票</a></li>
							<li><a href="../page/inv_invoiceReportOut.html">发票出库情况查询</a></li>
							<li><a href="../page/inv_invoiceReportEmp.html">收费人员发票查询</a></li>
							<li><a href="../page/inv_invoiceReportArchive.html">发票交票情况查询</a></li>
							<li><a href="../page/inv_invoiceReportUse.html">发票使用情况查询</a></li>
							<li><a href="../page/inv_invoiceReportMoneySum.html">销账汇总报表</a></li>
							<li><a href="../page/inv_invoiceReportMoneyDetail.html">销账明细报表</a></li>
						</ul>
					</div>
				</li>

				<li class="nav_dropdown nav_icon">
					<a href="javascript:;"><span class="ui-icon ui-icon-gear"></span>系统设置</a>

					<div class="nav_menu">
						<ul>
							<li><a href="../page/sys_area.html">抄表辖区</a></li>
							<li><a href="../page/sys_meterType.html">水表型号</a></li>
							<li><a href="../page/sys_dept.html">部门管理</a></li>
							<li><a href="../page/sys_emp.html">员工管理</a></li>
							<li><a href="../page/sys_menupower.html">菜单权限设置</a></li>
							<li><a href="../page/sys_areapower.html">辖区权限设置</a></li>
							<li><a href="../page/sys_waterType.html">用水类型设定</a></li>
							<li><a href="../page/sys_surcharge.html">附加费设定</a></li>
							<li><a href="../page/sys_flow.html">流程配置</a></li>
						</ul>

					</div>
				</li>

				<li class="nav_current nav_dropdown nav_icon_only">
					<a href="javascript:;">&nbsp;</a>

					<div class="nav_menu">
						<ul>
							<li><a href="../workspace.html">我的工作台</a></li>
							<li><a href="../page/sys_pwd.html">修改密码</a></li>
							<li><a href="../login.html">退出系统</a></li>
						</ul>
					</div> &lt;!&ndash; .menu &ndash;&gt;
				</li>
			</ul>
		</div> &lt;!&ndash; .content_pad &ndash;&gt;

	</div> &lt;!&ndash; #header &ndash;&gt;

	<div id="masthead">
		<div>
			<span id="pagetitle"><a href="javascript:;">业扩收费报表</a></span>
			<span id="welcome_span">欢迎回来，马云</span>
		</div>
	</div> &lt;!&ndash; #masthead &ndash;&gt;
-->
	<div id="content" class="xgrid">
		<form id="f1">
			<div class="x12">

				<h2>业扩收费报表</h2>

				<div class="searchDiv">
					业扩类型 &nbsp;&nbsp;
					<label><input value="1" type="checkbox" class="chk" checked="checked" name="arr"/>新户</label>
					<label><input value="2" type="checkbox" class="chk" checked="checked" name="arr"/>分户</label>
					<label><input value="5" type="checkbox" class="chk" checked="checked" name="arr"/>换表</label>
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					交费日期 <span class="between">
							<input type="date" name="payDate1" style="width: 115px"/> - <input type="date"
																							   name="payDate2"
																							   style="width: 115px"/>
						</span>
					<button class="btn btn-small btn-icon btn-find" type="button" @click="cx()"><span></span>查询</button>
				</div>


				<div class="reportTitle">
					业扩收费报表
				</div>
				<div class="height24">
					<div style="float:left;width:200px;">收费总金额：239434.00 元</div>
				</div>
				<table class="report">
					<thead>
					<tr>
						<th width="140">工单号</th>
						<th width="60">类型</th>
						<th>工单户名</th>
						<th width="120">用户姓名</th>
						<th width="120">交费日期</th>
						<th width="120">交费金额</th>
						<th width="120">发票号码</th>
					</tr>
					</thead>
					<tbody>
					<tr v-for="o in order">
						<td class="center" v-text="o.OrderNo">B1-20140105-0001</td>
						<td class="center" v-text="o.OrderType == '1' ? '新户' : o.OrderType == '2' ? '分户' : o.OrderType == '3' ? '过户' : o.OrderType == '4' ? '代扣' :
                    o.OrderType == '5' ? '换表' : o.OrderType == '6' ? '重签' : o.OrderType == '7' ? '销户' : ''">新户
						</td>
						<td class="left" v-text="o.oname">中国电信家属区A楼</td>
						<td class="left" v-text="o.UserName">张三</td>
						<td class="center" v-text="o.PayDate">2014年01月27日</td>
						<td class="right" v-text="o.RealMoney">3000.00 元</td>
						<td class="center" v-text="o.InvoiceNo">48549933</td>
					</tr>
					</tbody>
				</table>
				<!--<div class="page">
                    <a href="#">第一页</a>
                    <a href="#">上一页</a>
                    <input class="pageIndex" value="1"/> / <input class="pageCount" readonly="readonly" value="98765" />
                    <a href="#">下一页</a>
                    <a href="#">第未页</a>
                </div>-->
				<div class="lay">
					<div id="demo7"></div>
				</div>
			</div> <!-- .x12 -->
			<input type="hidden" name="curr" id="cu">
			<input type="hidden" name="limit" id="li">
		</form>
	</div> <!-- #content -->

	<div id="footer">
		<div class="content_pad">
			<p>&copy; 2013-11 版权所有 <a href="#">湖南省自来水公司</a>. 技术支持 <a href="#">职业教育</a>.</p>
		</div> <!-- .content_pad -->
	</div> <!-- #footer -->

</div> <!-- #wrapper -->

<script src="../js/jquery/jquery-1.5.2.min.js"></script>
<script src="../js/jquery/jquery-ui-1.8.12.custom.min.js"></script>
<script src="../js/misc/excanvas.min.js"></script>
<script src="../js/jquery/facebox.js"></script>
<script src="../js/jquery/jquery.visualize.js"></script>
<script src="../js/jquery/jquery.dataTables.min.js"></script>
<script src="../js/jquery/jquery.tablesorter.min.js"></script>
<script src="../js/jquery/jquery.uniform.min.js"></script>
<script src="../js/jquery/jquery.placeholder.min.js"></script>

<script src="../js/widgets.js"></script>
<script src="../js/dashboard.js"></script>
<script src="../My97DatePicker/WdatePicker.js"></script>


<script src="/webjars/vue/2.5.17/dist/vue.js"></script>
<script>
	var app = new Vue({
		el: "#content",
		data: {
			order: '',
		},
		methods: {
			cx() {
				alert(JSON.stringify($("#f1").serialize()))
				$.ajax({
					url: "/be-order/queryAllBeOrderUserSQLConut",
					type: "GET",
					data: $("#f1").serialize(),
					success: function (msg) {
						hh(msg,-1)
					}
				})
			}
		},
		created() {
			this.$nextTick(() => {
				$.ajax({
					url: "/be-order/queryAllBeOrderUserSQLConut",
					type: "GET",
					success: function (msg) {
						hh(msg,1)
					}
				})
			})
		}
	});
</script>
<script>
	function hh(size, i) {
		layui.use(['laypage', 'layer'], function () {
			var laypage = layui.laypage,
					layer = layui.layer;
			laypage.render({
				elem: 'demo7',
				count: size,
				layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip'],
				jump: function (obj) {
					console.log(obj)
					$("#cu").val(obj.curr)
					$("#li").val(obj.limit)
					if (i > 0) {
						$.ajax({
							url: "/be-order/queryAllBeOrderUserSQL",
							type: "GET",
							data: {"limit": obj.limit, "curr": obj.curr},
							datatype: "JSON",
							success: function (json) {
								app.order = json;
							}
						})
					}else{
						$.ajax({
							url: "/be-order/queryAllBeOrderUserSQL",
							type: "GET",
							data: $("#f1").serialize(),
							datatype: "JSON",
							success: function (json) {
								app.order = json;
							}
						})
					}
				}
			});
		});
	}
</script>
<script type="text/javascript">

	$(document).ready(function () {
		Dashboard.init();

	});


</script>

</body>

</html>